<template>
    <div>
        <el-card class="!border-none" shadow="never">
            <div class="mt-4">
                <el-table :data="formData.lists">
                    <el-table-column label="图标" min-width="100">
                        <template #default="{ row }">
                            <img :src="row.app_icon" alt="" style="width:40px;height:40px;border-radius: 8px;">
                        </template>
                    </el-table-column>
                    <el-table-column label="应用名称" prop="name" show-overflow-tooltip />
                    <el-table-column label="版本号" prop="version_no" show-overflow-tooltip>
                        <template #default="{ row }">
                            {{ row.version_no }}
                            <!-- <el-button
                                type="primary"
                                link
                                @click="viewDetails(row)"
                            >
                                <router-link
                                    :to="{
                                        path: getRoutePath(
                                            'application/appDetail'
                                        ),
                                        query: {
                                            app: row.app,
                                            an: '2',
                                        },
                                    }"
                                >
                                    发现新版本
                                </router-link>
                            </el-button> -->
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" min-width="120" fixed="right">
                        <template #default="{ row }">
                            <el-button type="primary" link>
                                <router-link :to="{
                                    path: getRoutePath(
                                        'application/appDetail'
                                    ),
                                    query: {
                                        app: row.app,
                                    },
                                }">
                                    查看详情
                                </router-link>
                            </el-button>
                            <el-button type="primary" link>
                                <router-link :to="{
                                    path: getRoutePath(
                                        'application/appDetail'
                                    ),
                                    query: {
                                        app: row.app,
                                        title: 1
                                    },
                                }">
                                    检查更新
                                </router-link>
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </el-card>
    </div>
</template>

<script lang="ts" setup>
import {
    apiInstallappLists,
    apiInstallappDelete,
    getAppPlugsList,
    installAppPlugs,
} from "@/api/installapp";
import feedback from "@/utils/feedback";
import { usePaging } from "@/hooks/usePaging";
import { getRoutePath } from "@/router";
import { getAppList, installApp } from "@/api/cloudupdate";
const route = useRoute();
const formData = reactive({
    app: route.query.app,
    lists: [],
});
const viewDetails = (row: any) => {
    console.log("row", row);
};
const getLists = async () => {
    const results = await apiInstallappLists(formData);
    formData.lists = results.lists;
};
const queryParams = reactive({
    name: "",
    create_time: "",
    uninstall_time: "",
});
const allAppList = ref<any[]>([]);
const allAppListFormat = ref<any[]>([]);
const appListSecond = ref<any[]>([]);
const appListThird = ref<any[]>([]);
const getPlugins = async () => {
    await getAppPlugsList(queryParams).then((res) => {
        console.log("res", res);
        console.log("res", formData.lists);
        formData.lists.forEach((element: any) => {
            res.forEach((i: any) => {
                if (element.app == i.app) {
                    element.last_version_no = i.version_no;
                    element.app_icon = i.app_icon;
                }
            });
        });
    });
};
getPlugins();
getLists();
</script>